<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>留学生管理系统</title>
        <link rel="stylesheet" href="${path}/css/admin2.css">
        <style>
            #location-modal-1, #location-modal-2{
                margin: 12% auto;
                padding: 10px;
                width: 400px;
            }
        </style>
        <script>
            var _current_item = "#adminlocmanage";
        </script>
        <script type="text/javascript" src="${path}/js/jquery.min.js"></script>
    </head>
    <body>
        <!--header-->
        <div id="above-mask">
            <div id="fileupload-pannel" class="fileupload pannel hide">
                <div class="close-container">
                    <a class="close" onclick="hide('#above-mask, #mask, #fileupload-pannel');">×</a>
                </div>
                <form action="${path}/adminlocmanage/fileUpload" method="post" enctype="multipart/form-data" name="fileForm">
                    <div style="margin-top: 30px;"> 上传文件：（支持Excel 97-2003 工作簿 .xls格式文件）</div>
                    <input id="fileCover" class="left" readonly="readonly" placeholder="导入excel文件" type="text" style="width: 280px; height: 22px;">
                    <button onclick="$('#uploadFile').click();return false;" style="background: #aaa">浏览文件</button>
                    <input type="file" name="uploadFile" required="required" id="uploadFile" style="display:none" onchange="$('#fileCover').val($(this).val());">
                    <div>
                        <button type="submit" style="display: block; margin: 0 auto;">提交</button> 
                    </div>
                </form>
            </div>
            <div class="pannel hide" id="location-modal-1">
                <div class="am-modal-dialog">
                    <div class="close-container">
                        <a class="close" onclick="hide('#mask, #above-mask, #location-modal-1')">&times;</a>
                    </div>
                    <form action="${path}/adminlocmanage/submit" method="post">
                        <table id="locationtable1">
                            <tr>
                                <td>教室编号</td>
                                <td> <input type="text" placeholder="必填" style="width:188px;height:27px" name="classroom.classroomNo" required="required"></td>
                            </tr>
                            <tr>
                                <td>教室容量</td>
                                <td> <input type="number" min="0" max="200" placeholder="必填" style="width:188px;height:27px" name="classroom.classroomVolume" required="required"></td>
                            </tr>
                            <tr>
                                <td>考试容量</td>
                                <td> <input type="number" min="0" max="200" placeholder="必填" style="width:188px;height:27px" name="classroom.examVolume" required="required"></td>
                            </tr>
                            <tr>
                                <td>教室类型</td>
                                <td> <input type="text" placeholder="必填" style="width:188px;height:27px" name="classroom.classroomType" required="required"></td>
                            </tr>
                            <tr><td colspan="2"><button type="submit">提交</button></td></tr>
                        </table>
                    </form>
                </div>
            </div>
            <div class="pannel hide" id="location-modal-2">
                <div class="close-container">
                    <a class="close" onclick="hide('#mask, #above-mask, #location-modal-2')">&times;</a>
                </div>
                <form action="${path}/adminlocmanage/update" method="post">
                    <table id="locationtable2">
                        <tr>
                            <td>教室编号</td>
                            <td></td>
                        </tr>
                        <tr>
                            <td>教室容量</td>
                            <td><input type="number" min="0" max="200" placeholder="必填" style="width:188px;height:27px"name="classroom.classroomVolume" id="classroomVolume"value="" ></td>
                        </tr>
                        <tr>
                            <td>考试容量</td>
                            <td> <input type="number" min="0" max="200" placeholder="必填" style="width:188px;height:27px" name="classroom.examVolume"id="examVolume" value=""></td>
                        </tr>
                        <tr>
                            <td>教室类型</td> 
                            <td><input type="text" placeholder="必填" style="width:188px;height:27px" name="classroom.classroomType" id="classroomType"value=""></td>
                        </tr>
                        <tr>
                            <td colspan="2"> <input type="hidden" id="id" name="classroom.id" value="">
                                <button type="button" onclick="ajaxupdate(); hide('#mask, #above-mask, #location-modal-2')">确定</button>
                            </td>
                        </tr>
                    </table>				
                </form>
            </div>
        </div>
        <div id="mask"></div>
        <div id="header"></div>
        <div id="main">
            <div id="side-menu"></div>
            <div id="container">
                <div id="inner-border">
                
                        <select id="keyword" name="keyword" class="major2">
                            <option value="all">全部</option>
                            <#if classroomType?exists>
                            <#list classroomType as ct>
                            <option value="${ct.classroomType}">${ct.classroomType}</option>
                            </#list>
                            </#if>
                        </select>
                        <button onclick="ajaxsearch()">筛选</button>
                    <button onclick="window.location.href='${path}/adminlocmanage/fileDownload'">模板下载</button>
                    <button onclick="show('#mask, #above-mask, #fileupload-pannel')">批量导入</button>
                    <button onclick="window.location.href='${path}/classroomExport/exportExcel'">批量导出</button>
                    <button onclick="show('#mask, #above-mask, #location-modal-1')">新增教室</button>
                    
    
                    <form action="${path}/adminlocmanage/batch" method="post">
                        <input type="hidden" name="checkboxValue" id="checkboxValue">
                        <div id="error" style="display:none">${error!}</div>
                        <table id="locationtable">
                            <thead>
                                <tr>
                                    <th>&nbsp;&nbsp;&nbsp;</th>
                                    <th>教室编号</th>
                                    <th>教室容量</th>
                                    <th>考试容量</th>
                                    <th>教室类型</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                <#if classroom?exists>
                                <#list classroom as cr> 
                                <tr>
                                    <td><input type="checkbox" value="${cr.id}" name="locCheckbox" id="locCheckbox"></td>
                                    <td>${cr.classroomNo}</td>
                                    <td>${cr.classroomVolume}</td>
                                    <td>${cr.examVolume}</td>
                                    <td>${cr.classroomType}</td>
                                    <td> <button name="editBtn" class="edit" onclick="edit(this);show('#mask, #above-mask, #location-modal-2');return false;">编辑</button></td> 
                                </tr>
                                </#list>
                                </#if>
                            </tbody>
                        </table>
                        <button class="delete" type="submit" onclick="getParam('locationtable', 'checkboxValue');">删除</button>
                    </form>  
                </div>
            </div>
        </div>    
        <div id="footer"></div>    
        <script type="text/javascript" src="${path}/js/admin-main-appearance.js"></script>

        <!-- DataTables JavaScript -->
        <script src="${path}/bower_components/datatables/media/js/jquery.dataTables.min.js"></script>
        <script src="${path}/bower_components/datatables-plugins/api/fnGetHiddenNodes.js"></script>
        <script src="${path}/bower_components/datatables-plugins/api/fnGetTd.js"></script>
        <script src="${path}/bower_components/datatables-plugins/api/fnGetTds.js"></script>
        <script src="${path}/bower_components/datatables-plugins/api/fnGetColumnData.js"></script>
        <script src="${path}/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js"></script>
        <script src="${path}/js/linkPage.js"></script>
        <script type="text/javascript">
            function ajaxsearch(){
                $.ajax({
                    type:"post",
                    url:'${path}/adminlocmanage/ajaxsearch',
                    data:{
                        keyword:$('#keyword').val(),
                    },
                    datatype:"json",
                    success:function(data){
                        //alert("success");
                        //for(var i=0;i<data.length;i++)
                        //alert(data[i]["classroomNo"]);

                        $(document).ready(function() {
                            $('#locationtable').dataTable().fnClearTable();
                            for(var i=0;i<data.length;i++){
                            $('#locationtable').dataTable().fnAddData(['<input type="checkbox" value="'+data[i]["id"]+'" name="locCheckbox" id="locCheckbox" >',data[i]["classroomNo"],data[i]["classroomVolume"],data[i]["examVolume"],data[i]["classroomType"], '<button name="editBtn" class="edit"  class="edit" onclick="edit(this);show(\'#mask, #above-mask, #location-modal-2\');return false;">编辑</button>']);
                                var id=data[i]["id"];
                                //alert(id);
                                var ot=$('#locationtable').dataTable();
                            }
                        });
                    }
                });
            }
        </script>
        <script type="text/javascript">
            var row;
            function edit(node) {
                var tr1 = node.parentNode.parentNode;
                document.getElementById('locationtable2').rows[0].cells[1].innerText = tr1.cells[1].innerText;
                document.getElementById('classroomVolume').value = tr1.cells[2].innerText;
                document.getElementById('examVolume').value = tr1.cells[3].innerText;
                document.getElementById('classroomType').value = tr1.cells[4].innerText;
                document.getElementById('id').value = tr1.cells[0].children[0].value;
                row = tr1.rowIndex;
                return row;
            }

            function ajaxupdate() {
                $.ajax({
                    type: "post",
                    url: '${path}/adminlocmanage/ajaxupdate',
                    data: {
                        classroomVolume: $('#classroomVolume').val(),
                        examVolume: $('#examVolume').val(),
                        classroomType: $('#classroomType').val(),
                        id: $('#id').val(),
                    },
                    datatype: "json",
                    success: function (data) {
                        // alert("success");
                        // alert(data.classroom[0]["classroomNo"]);
                        // alert(data.error);
                        /* for(var i=0;i<data.length;i++)
                         alert(data[i]["majorNo"]); */
                        document.getElementById('locationtable').rows[row].cells[2].innerText = data.classroom[0]["classroomVolume"];
                        document.getElementById('locationtable').rows[row].cells[3].innerText = data.classroom[0]["examVolume"];
                        document.getElementById('locationtable').rows[row].cells[4].innerText = data.classroom[0]["classroomType"];

                    }
                });
            }
        </script>
        <script type="text/javascript">
            $(document).ready(function () {
                $('#locationtable').DataTable({
                    responsive: true,
                    ordering: false,
                    searching: true,
                    "bLengthChange": false,
                    "bRetrieve": true,
                    "bFilter": true//过滤功能
                });
            });
        </script> 
        <script type="text/javascript">
            $(document).ready(function () {
                if ($("#error").html() != "") {
                    Alert($("#error").html());
                }
                //alert($("#error").html());}
            });
        </script> 
        <script>
            //自动关闭提示框  
            function Alert(str) {
                var msgw, msgh, bordercolor;
                msgw = 350;//提示窗口的宽度  
                msgh = 80;//提示窗口的高度  
                titleheight = 25 //提示窗口标题高度  
                bordercolor = "#336699";//提示窗口的边框颜色  
                titlecolor = "#99CCFF";//提示窗口的标题颜色  
                var sWidth, sHeight;
                //获取当前窗口尺寸  
                sWidth = document.body.offsetWidth;
                sHeight = document.body.offsetHeight;
                //    //背景div  
                var bgObj = document.createElement("div");
                bgObj.setAttribute('id', 'alertbgDiv');
                bgObj.style.position = "absolute";
                bgObj.style.top = "0";
                bgObj.style.background = "#E8E8E8";
                bgObj.style.filter = "progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";
                bgObj.style.opacity = "0.6";
                bgObj.style.left = "0";
                bgObj.style.width = sWidth + "px";
                bgObj.style.height = sHeight + "px";
                bgObj.style.zIndex = "10000";
                document.body.appendChild(bgObj);
                //创建提示窗口的div  
                var msgObj = document.createElement("div")
                msgObj.setAttribute("id", "alertmsgDiv");
                msgObj.setAttribute("align", "center");
                msgObj.style.background = "white";
                msgObj.style.border = "1px solid " + bordercolor;
                msgObj.style.position = "absolute";
                msgObj.style.left = "50%";
                msgObj.style.font = "12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif";
                //窗口距离左侧和顶端的距离   
                msgObj.style.marginLeft = "-225px";
                //窗口被卷去的高+（屏幕可用工作区高/2）-150  
                msgObj.style.top = document.body.scrollTop + (window.screen.availHeight / 2) - 150 + "px";
                msgObj.style.width = msgw + "px";
                msgObj.style.height = msgh + "px";
                msgObj.style.textAlign = "center";
                msgObj.style.lineHeight = "25px";
                msgObj.style.zIndex = "10001";
                document.body.appendChild(msgObj);
                //提示信息标题  
                var title = document.createElement("h4");
                title.setAttribute("id", "alertmsgTitle");
                title.setAttribute("align", "left");
                title.style.margin = "0";
                title.style.padding = "3px";
                title.style.background = bordercolor;
                title.style.filter = "progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);";
                title.style.opacity = "0.75";
                title.style.border = "1px solid " + bordercolor;
                title.style.height = "18px";
                title.style.font = "12px Verdana, Geneva, Arial, Helvetica, sans-serif";
                title.style.color = "white";
                title.innerHTML = "提示信息";
                document.getElementById("alertmsgDiv").appendChild(title);
                //提示信息  
                var txt = document.createElement("p");
                txt.setAttribute("id", "msgTxt");
                txt.style.margin = "16px 0";
                txt.innerHTML = str;
                document.getElementById("alertmsgDiv").appendChild(txt);
                //设置关闭时间  
                window.setTimeout("closewin()", 2000);
            }
            function closewin() {
                document.body.removeChild(document.getElementById("alertbgDiv"));
                document.getElementById("alertmsgDiv").removeChild(document.getElementById("alertmsgTitle"));
                document.body.removeChild(document.getElementById("alertmsgDiv"));
            }
        </script>
    </body>
</html>
